<template>
    <div class="bottom">
        <ul>
            <li @click="$router.push('/recommend')">
                <span class="iconfont icon-shouye"></span>
                <p>首页</p> 
            </li>
            <li @click="$router.push('/discover')">
                <span class="iconfont icon-xiaoxitongzhi"></span>
                <p>通知</p>
            </li>
            <li @click="$router.push('/follo')">
                <span class="iconfont icon-chakantieziguanzhu"></span>
                <p>关注</p>
            </li>
            <li  @click="$router.push('/userInfo').catch(()=>{})">
                <span class="iconfont icon-wode1"></span>
                <p>我的</p>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    
}
</script>

<style lang="less">
.bottom{
    width: 100%;
    height: 50px;
    background-color: #e2bdb4;
    position: fixed;
    left: 0px;
    bottom: 0px;
    ul{
        display: flex;
        justify-content: space-around;
        li{
            color: white;
            text-align: center;
            span{
                font-size: 28px;
            }
            p{
                font-size: 10px;
            }
        }
    }
}

</style>